<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>计算机面试必备工具</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="container">
        <header>
            <h1>计算机面试必备工具</h1>
        </header>
        <main>
            <div class="control-panel">
                <div class="position-select">
                    <select id="positionSelect">
                        <option value="hr">人事面试</option>
                        <option value="java">Java开发岗</option>
                        <option value="python">Python开发岗</option>
                        <option value="go">Go开发岗</option>
                        <option value="ops">运维岗</option>
                        <option value="mysql">MySQL数据库</option>
                        <option value="implementation">实施岗位</option>
                        <option value="cloud">云计算岗位</option>
                        <option value="bigdata">大数据岗位</option>
                    </select>
                </div>
                <div class="mode-switch">
                    <label class="switch">
                        <input type="checkbox" id="modeToggle" checked>
                        <span class="slider round"></span>
                    </label>
                    <span class="mode-label">面试官模式</span>
                </div>
                <div class="file-upload">
                    <input type="file" id="fileUpload" accept=".xlsx,.xls" />
                    <p class="upload-hint">支持上传Excel文件（仅支持两列：题目和答案）</p>
                </div>
            </div>
            <div class="display-panels">
                <div class="question-panel">
                    <h2>面试题目</h2>
                    <div id="questionContent" class="content"></div>
                </div>
                <div class="answer-panel" id="answerPanel">
                    <h2>参考答案</h2>
                    <div id="answerContent" class="content"></div>
                </div>
            </div>
            <div class="next-button-container">
                <button id="nextButton" class="next-button">下一题</button>
                <select id="questionCount" class="question-count">
                    <option value="1">1题</option>
                    <option value="2">2题</option>
                    <option value="3">3题</option>
                    <option value="4">4题</option>
                    <option value="5">5题</option>
                </select>
            </div>
        </main>
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
    <script src="app.js"></script>
</body>
</html>